define([
    'jquery',
    'underscore',
    'backbone',
    'text!templates/business/service-make-appointment.html',
    'iscroll'
], function ($, _, Backbone, template) {
    var ServiceDetailView = Backbone.View.extend({

        tagName:"div", // Not required since 'div' is the default if no el or tagName specified
        template:_.template(template),
        initialize:function () {

            /*this.template = _.template(tpl.get('business/business-details'));*/
            this.model.bind("change", this.render, this);
        },

        render:function (eventName) {
            $(this.el).html(this.template(this.model.toJSON()));
            return this;
        },

        events:{
            /*"change input":"change",*/
            "click .save":"saveAppointment"
            /*"click .delete":"deleteBusiness"*/
        },

        change:function (event) {
            var target = event.target;
            console.log('changing ' + target.id + ' from: ' + target.defaultValue + ' to: ' + target.value);
            // You could change your model on the spot, like this:
            // var change = {};
            // change[target.name] = target.value;
            // this.model.set(change);
        },

        saveAppointment:function () {

            this.model.set({
                title:$('#title').val(),
                content:$('#grapes').val(),
                consumer_id:$('#consumer_id').val(),
                priority:$('#priority').val()
            });

            var self = this;
            app.appointmentList.create(this.model, {
                success:function () {
                    app.navigate('api/business/' + self.model.id, false);
                }
            });

            return false;
        },

        scrollRender:function () {
            this.scrollNav = new iScroll('navWrapper');
            this.scrollContent = new iScroll('contentWrapper');
        },

        deleteService:function () {
            this.model.destroy({
                success:function () {
                    alert('Service deleted successfully');
                    window.history.back();
                }
            });
            return false;
        }

    });
    return ServiceDetailView
});

